.search-components{
  .searchWrap {
    font-size: 12px;
    padding: 0 5px;
    box-sizing: border-box;
    .searchLeft {
      padding: 5px;
    }
    .searchWrap_a {
      padding: 0 3px;
      .searchInp {
        border: none;
        background-color: transparent;
        padding: 0 5px;
      }
    }
    .searchRight {
      padding: 5px;
    }
  }
  .design-editor-form-con{
    width: 100%;
    display: flex;
    flex-direction: row;
    border-bottom:1px solid #dedede;
    .form-con-sub-detail{
      width: 50%;
      height: 30px;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      .form-con-sub-detail-content{
        width: 100px;
        height: 30px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        span{
          font-size: 13px;
        }
        &.active{
          border-bottom:3px solid #333333;
          span{
            font-size: 16px;
          }
        }
      }
    }
    &.active-class{
      border-bottom: 3px solid #dedede
    }
  }
  .form-con-sub-detail-list{
    margin:10px;
    .form-con-sub-detail-list-form{
      background-color: #f0f2f5;
      border-radius: 6px;
      padding-bottom: 10px;
      .title-form-content{
        padding: 10px;
        font-size: 14px;
        font-weight: 700;
        color: #595961;
      }
      .title-form-placehoder{
        margin-left: 10px;
        display: flex;
        flex-direction: row;
        .title-form-placehoder-title-text{
          display: flex;
          flex-direction: column;
          justify-content: center;
        }
        .title-form-placehoder-title-input{
          margin-left: 10px;
          .el-textarea__inner{
            height: 30px;
            font-size: 12px;
          }
        }
      }
      .contentFlagWrap {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding:10px;
        .el-radio-button--small .el-radio-button__inner{
          padding: 4px 10px;
        }
      }
    }
    .form-con-sub-detail-list-form-css{
       margin-top: 10px;
      .form-con-sub-detail-list-form-sub{
        background-color: #f0f2f5;
        border-radius: 6px;
        padding-bottom: 5px;
        .title-form-content{
          padding: 10px;
          font-size: 14px;
          font-weight: 700;
          color: #595961;
        }
        .search-css-set-con{
          display: flex;
          margin: 10px;
          flex-direction: column;
          .search-css-detail{
            display: flex;
            flex-direction: row;
            justify-content: space-between;
            margin: 10px 0;
            .el-radio-button--small .el-radio-button__inner{
              padding: 4px 10px;
            }
            .el-color-picker{
              margin-left: 10px;
            }
            a{
              color: #1890ff;
            }
            .el-color-picker--mini .el-color-picker__trigger{
              width: 50px;
            }
            .flex-column-con{
              display: flex;
              flex-direction: column;
              justify-content: center;
              // align-items: center;
            }
            .borderColor-search-con{
              display: flex;
              flex-direction: row;
              .borderColor-search-con-sub{
                display: flex;
                flex-direction: column;
                justify-content: center;
              }
            }

          }
          .search-css-detail:first-child{
            margin-top: 0;
          }
        }
        .marginWrap {
          width: 100%;
          display: flex;
          align-items: center;
          justify-content: space-between;
          padding:10px;
          .marginBox {
            display: flex;
            align-items: center;
            .marginText {
              margin-left: 10px;
            }
          }
          .el-radio-button--small .el-radio-button__inner{
            padding: 4px 10px;
          }
        }
        .progressWrap {
          padding:10px;
          .progressBox {
            width: 100%;
            height: 40px;
            padding:5px;
            background-color: #FFFFFF;
            .progress {
              padding: 0 10px;
            }
            .inpWrap {
              width: 30px;
              height: 30px;
              text-align: center;
              line-height: 30px;
            }
          }
        }
      }
      .sub-margin{
        margin-top: 10px
      }
    }
  }
}
